<template>
  <el-row class="sheet" id="sheet">
    <!-- 0. 吸顶 -->
    <el-row id="CM_WK_BASIC1" type="flex" class="header-fixed" :style="`width:${headerWidth}px`" v-show="headerFixed">
      <FirstTitle :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="井号" dataType="basic" dataName="wellName"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="本层套管尺寸 in" dataType="basic" dataName="caseSize"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 1. 基本数据 -->
    <el-row id="CM_WK_BASIC" type="flex" class="border-style">
      <FirstTitle title="基本数据" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="井号" dataType="basic" dataName="wellName"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="本层套管尺寸 in" dataType="basic" dataName="caseSize"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="本层套管下深 m" dataType="basic" dataName="caseDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="井眼尺寸 in" dataType="basic" dataName="holeSize"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="井深 m" dataType="basic" dataName="holeDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="固井工程师" dataType="basic" dataName="cementEngineer"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 2. 钻进情况 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="钻进情况" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="气全量最高点深度 m" dataType="drilling" dataName="totalGasDepth"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="气全量峰值 %" dataType="drilling" dataName="totalGasMaxValue"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="峰值点对应的钻井液密度 g/cm³" dataType="drilling" dataName="fluidDensity"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="完钻时气全量 %" dataType="drilling" dataName="afterDrillTotalGas"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="钻进时最高排量 m³/min" dataType="drilling" dataName="drillMaxDisplacement"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="完钻后的排量 m³/min" dataType="drilling" dataName="afterDrillMaxDisplacement"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="完钻后与钻杆环空返速 m/s" dataType="drilling" dataName="drillPipeAV"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="完钻后与钻铤环空返速 m/s" dataType="drilling" dataName="drillCollarAV"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 3. 通井情况 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="通井情况" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="通井时最高排量 m³/min" dataType="pigging" dataName="piggingMaxDisplacement"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="气全量（最大）%" dataType="pigging" dataName="maxTotalGas"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="气全量（最终）%" dataType="pigging" dataName="endTotalGas"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="气窜速度 m/h" dataType="pigging" dataName="gasChannelingVelocity"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="通井时与钻杆环空返速 m/s" dataType="pigging" dataName="drillPipeAV"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="通井时与钻铤环空返速 m/s" dataType="pigging" dataName="drillCollarAV"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 4. 泥浆转换深度 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="泥浆转换深度" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="转换前泥浆类型" dataType="fluidChange" dataName="fluidType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="转换时井深 m" dataType="fluidChange" dataName="wellDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 5. 泥浆性能（调整前后) -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="泥浆性能<br/>（调整前后） " :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="固井状态" dataType="fluidProperty" dataName="cementStatus"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泥浆类型" dataType="fluidProperty" dataName="fluidType"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="钻井液密度 g/cm³" dataType="fluidProperty" dataName="density"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="漏斗粘度 sec/qt" dataType="fluidProperty" dataName="fv"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="视粘度 cps" dataType="fluidProperty" dataName="av"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="动切力 lb/100ft²" dataType="fluidProperty" dataName="yp"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="静切力10秒 lb/100ft²" dataType="fluidProperty" dataName="gel10S"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="静切力10分 lb/100ft²" dataType="fluidProperty" dataName="gel10M"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计3读数" dataType="fluidProperty" dataName="rpm3"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计6读数" dataType="fluidProperty" dataName="rpm6"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计100读数" dataType="fluidProperty" dataName="rpm100"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计200读数" dataType="fluidProperty" dataName="rpm200"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计300读数" dataType="fluidProperty" dataName="rpm300"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计600读数" dataType="fluidProperty" dataName="rpm600"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 6. 电测温度 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="电测温度" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="第一趟电测温度 ℃" dataType="logging" dataName="logTemper1"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="第一趟电测静止时间 HRs" dataType="logging" dataName="logStopTime1"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="第二趟电测温度 ℃" dataType="logging" dataName="logTemper2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="第二趟电测静止时间 HRs" dataType="logging" dataName="logStopTime2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="第三趟电测温度 ℃" dataType="logging" dataName="logTemper3"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="第三趟电测静止时间 HRs" dataType="logging" dataName="logStopTime3"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 7. 随钻工具测温 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="随钻工具测温" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="完钻时温度 ℃" dataType="thermometry" dataName="afterDrillT"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="完钻循环结束温度 ℃" dataType="thermometry" dataName="afterDrillCycleT"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="通井到底温度 ℃" dataType="thermometry" dataName="piggingT"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="通井循环后温度 ℃" dataType="thermometry" dataName="piggingCycleT"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 8. 地层压力数据 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="地层压力数据" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="地层最大压力当量 g/cm3" dataType="formationPressure" dataName="layerMaxPressure"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="油层段地层压力当量 g/cm³" dataType="formationPressure" dataName="oilLayerPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="井底地层压力当量 g/cm³" dataType="formationPressure" dataName="bottomPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="地层最大破裂压力当量 g/cm³" dataType="formationPressure" dataName="layerMaxFracturePressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="油层段破裂压力当量 g/cm³" dataType="formationPressure" dataName="oilLayerFracturePressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="井底破裂压力当量 g/cm³" dataType="formationPressure" dataName="bottomFracturePressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="地层最小漏失压力当量 g/cm³" dataType="formationPressure" dataName="layerMinLostPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="油层段漏失压力当量 g/cm³" dataType="formationPressure" dataName="oilLayerLostPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="井底漏失压力当量 g/cm³" dataType="formationPressure" dataName="bottomLostPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 9. 水泥浆化验数据 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="水泥浆化验数据" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="实验项目" dataType="mudProperty" dataName="experimentItem"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="项目序号" dataType="mudProperty" dataName="itemNo"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="水泥类型" dataType="mudProperty" dataName="mudType"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="基液类型" dataType="mudProperty" dataName="fluidType"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="混合水氯根(化验室)" dataType="mudProperty" dataName="cl"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="静止温度 ℃" dataType="mudProperty" dataName="stopTemperature"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="循环温度 ℃" dataType="mudProperty" dataName="recyleTemperature"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="井底静压 Mpa" dataType="mudProperty" dataName="holePressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="稠化时间 @ 100BC" dataType="mudProperty" dataName="thickTime"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="水泥浆密度 g/cm³" dataType="mudProperty" dataName="mudDensity"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="造浆率" dataType="mudProperty" dataName="mudYield"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="水灰比" dataType="mudProperty" dataName="waterCementRatio"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="API失水 ml" dataType="mudProperty" dataName="apiLossWater"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="自由水 %" dataType="mudProperty" dataName="freeWater"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="24小时抗压强度 Mpa" dataType="mudProperty" dataName="pressure24"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 10. 油层位置 -->
    <!-- <el-row type="flex" class="border-style">
      <FirstTitle title="油层位置" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="油层类型"  dataType="youcengweizhi" dataName="youcengleixing"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="显示顶流体类型" dataType="youcengweizhi" dataName="liutileixing"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="斜深m" dataType="youcengweizhi" dataName="xieshen"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="垂深m" dataType="youcengweizhi" dataName="chuishen"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row> -->

    <!-- 11. 特殊层 -->
    <!-- <el-row type="flex" class="border-style">
      <FirstTitle title="特殊层" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="层名"  dataType="teshuceng" dataName="cengming"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="流体类型" dataType="teshuceng" dataName="liutileixing"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="斜深m" dataType="teshuceng" dataName="xieshen"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="垂深m" dataType="teshuceng" dataName="chuishen"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row> -->

    <!-- 12. 尾管挂 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="尾管挂" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="尾管挂厂家"  dataType="tailCaseHange" dataName="factory"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="尾管坐挂压力（设计）Mpa" dataType="tailCaseHange" dataName="tailCasePressure1"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="球座剪切压力（设计）Mpa" dataType="tailCaseHange" dataName="ballPressure1"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="大胶塞剪切压力（设计）Mpa" dataType="tailCaseHange" dataName="rubberPressure1"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="顶封坐封重量（设计）Mpa" dataType="tailCaseHange" dataName="topSealWeight1"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="尾管坐挂压力 Mpa" dataType="tailCaseHange" dataName="tailCasePressure2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="球座剪切压力 Mpa" dataType="tailCaseHange" dataName="ballPressure2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="大胶塞剪切压力 Mpa" dataType="tailCaseHange" dataName="rubberPressure2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="顶封坐封重量 ton" dataType="tailCaseHange" dataName="topSealWeight2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 13. 固井前循环 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="固井前循环" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="时间 min"  dataType="circulation" dataName="cycleHour"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="最高泵速 m³/min" dataType="circulation" dataName="maxPumpV"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵压 Mpa" dataType="circulation" dataName="pumpPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="环空返速（电测环容）m/s" dataType="circulation" dataName="returnVolLog"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="环空返速（设计环容）m/s" dataType="circulation" dataName="returnVolDesign"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="环空返速（理论环容）m/s" dataType="circulation" dataName="returnVolTheory"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 14. 固井流体数据冲洗液与隔离液 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="固井流体数据冲洗液与隔离液" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="流体类型"  dataType="cementFluid" dataName="fluidType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="配方组成" dataType="cementFluid" dataName="formula"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="密度 g/cm³" dataType="cementFluid" dataName="density"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计3转数" dataType="cementFluid" dataName="rpm3"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计6转数" dataType="cementFluid" dataName="rpm6"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计100转数" dataType="cementFluid" dataName="rpm100"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计200转数" dataType="cementFluid" dataName="rpm200"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计300转数" dataType="cementFluid" dataName="rpm300"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="旋转粘度计600转数" dataType="cementFluid" dataName="rpm600"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="热滚前漏斗粘度" dataType="cementFluid" dataName="fv1"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="热滚后漏斗粘度" dataType="cementFluid" dataName="fv2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="注入量 m³" dataType="cementFluid" dataName="injectVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="隔离混合水 m³" dataType="cementFluid" dataName="isolatedWaterVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 15. 领浆 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="领浆" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="流体类型"  dataType="fluidFirst" dataName="fluidType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="序号" dataType="fluidFirst" dataName="no"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="开始封固段 m" dataType="fluidFirst" dataName="begin"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="结束封固段 m" dataType="fluidFirst" dataName="end"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="附加量 %" dataType="fluidFirst" dataName="excessVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="平均密度@波动 g/cm³" dataType="fluidFirst" dataName="density"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="注入量 m³" dataType="fluidFirst" dataName="injectVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="干水泥量 T" dataType="fluidFirst" dataName="cementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="混合水量 m³" dataType="fluidFirst" dataName="mixWaterVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="排量 m³/min" dataType="fluidFirst" dataName="displacementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵压 Mpa" dataType="fluidFirst" dataName="pumpPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 16. 中间液 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="中间液" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="开始填充段 m" dataType="fluidMiddle" dataName="begin"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="结束填充段 m" dataType="fluidMiddle" dataName="end"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="附加量 %" dataType="fluidMiddle" dataName="excessVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="中间液量调整系数 l/m" dataType="fluidMiddle" dataName="coefficient"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="平均密度 g/cm³" dataType="fluidMiddle" dataName="density"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="注入量 m³" dataType="fluidMiddle" dataName="injectVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="其中冲洗液量 m³" dataType="fluidMiddle" dataName="flushingFluidVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="排量 m³/min" dataType="fluidMiddle" dataName="displacementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵压 Mpa" dataType="fluidMiddle" dataName="pumpPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 17. 尾浆 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="尾浆" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="序号" dataType="fluidLast" dataName="no"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="开始封固段 m" dataType="fluidLast" dataName="begin"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="结束封固段 m" dataType="fluidLast" dataName="end"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="附加量 %" dataType="fluidLast" dataName="excessVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="平均密度@波动 g/cm³" dataType="fluidLast" dataName="density"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="注入量 m³" dataType="fluidLast" dataName="injectVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="干水泥量 T" dataType="fluidLast" dataName="cementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="混合水量 m³" dataType="fluidLast" dataName="mixWaterVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="排量 m³/min" dataType="fluidLast" dataName="displacementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵压 Mpa" dataType="fluidLast" dataName="pumpPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 18. 顶替过程 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="顶替过程" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="顶替类型" dataType="displaceData" dataName="displacementType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="顶替流体" dataType="displaceData" dataName="displacementFluid"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="排量 m³/min" dataType="displaceData" dataName="displacementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="替入量（设计）m³" dataType="displaceData" dataName="replaceVolDesign"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="替入量（实际）m³" dataType="displaceData" dataName="replaceVolActual"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵压 Mpa" dataType="displaceData" dataName="pumpPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="环空返速（电测环容）m/s" dataType="displaceData" dataName="returnVolLog"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="环空返速（设计环容）m/s" dataType="displaceData" dataName="returnVolDesign"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="环空返速（理论环容）m/s" dataType="displaceData" dataName="returnVolTheory"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 19. 固井顶替 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="固井顶替" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="碰压 Mpa" dataType="displace" dataName="bumpPressure"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵效 %" dataType="displace" dataName="pumpEfficiency"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="设计流量计 m³" dataType="displace" dataName="designFlowmeter"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="实际流量计 m³" dataType="displace" dataName="actualFlowmeter"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 20. 返出流体 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="返出流体" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="类型" dataType="returnFluid" dataName="returnFluidType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="数量 m³" dataType="returnFluid" dataName="returnFluidVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 21. 尾管顶部清洗 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="尾管顶部清洗" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="坐封顶部封隔器时间 min" dataType="tailClear" dataName="packerTime"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="混浆返出时间 min" dataType="tailClear" dataName="mixReturnTime"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="排量 m³/min" dataType="tailClear" dataName="displacementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="泵压 Mpa" dataType="tailClear" dataName="pumpPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="循环出水泥浆量 m³" dataType="tailClear" dataName="circleFluidVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 22. 当量比重 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="当量比重" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="油顶处（设计）g/cm³" dataType="emw" dataName="top"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="油底处（设计）g/cm³" dataType="emw" dataName="bot"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="T.D.（设计）g/cm³" dataType="emw" dataName="td"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="油顶处（实际）g/cm³" dataType="emw" dataName="top2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="油底处（实际）g/cm³" dataType="emw" dataName="bot2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="T.D.（实际）g/cm³" dataType="emw" dataName="td2"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 23. 复杂情况 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="复杂情况" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="复杂情况类型" dataType="complex" dataName="complexType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="复杂情况描述" dataType="complex" dataName="description"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 24. 流体评价 -->
    <el-row type="flex" class="border-style">
      <FirstTitle title="流体评价" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="流体类型" dataType="fluidValue" dataName="fluidType"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="流体序号" dataType="fluidValue" dataName="no"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测开始深度 m" dataType="fluidValue" dataName="logBeginDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测结束深度 m" dataType="fluidValue" dataName="logEndDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测容量 m³" dataType="fluidValue" dataName="logVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测裸眼单位段容 l/m" dataType="fluidValue" dataName="logUnitVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="实际开始深度 m" dataType="fluidValue" dataName="realBeginDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="实际结束深度 m" dataType="fluidValue" dataName="realEndDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="实际容量 m³" dataType="fluidValue" dataName="realVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="实际裸眼单位段容 l/m" dataType="fluidValue" dataName="realUnitVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="在电测基础上附加 %" dataType="fluidValue" dataName="logExcessVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="相当理论环容附加量 %" dataType="fluidValue" dataName="theroyExcessVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测质量后开始深度 m" dataType="fluidValue" dataName="logAfterBeginDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测质量后结束深度 m" dataType="fluidValue" dataName="logAfterEndDepth"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测质量后容量 m³" dataType="fluidValue" dataName="logAfterVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="电测质量后裸眼单位段容 l/m" dataType="fluidValue" dataName="logAfterUnitVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="反推最佳附加量 %" dataType="fluidValue" dataName="bestExcessVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

    <!-- 25. 井口回注 -->
    <el-row type="flex" class="border-style bottom-blod">
      <FirstTitle title="井口回注" :firstTitleSpan="firstTitleSpan" />
      <el-col :span="24 - firstTitleSpan">
        <DataRow title="开始封固段 m" dataType="wellReject" dataName="begin"
          :isHeader="true"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="结束封固段 m" dataType="wellReject" dataName="end"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="水泥浆量 m³" dataType="wellReject" dataName="fluidVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="水泥浆类型" dataType="wellReject" dataName="fluidType"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="平均密度@波动 g/cm³" dataType="wellReject" dataName="density"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="挤入压力 Mpa" dataType="wellReject" dataName="entryPressure"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="顶替量 m³" dataType="wellReject" dataName="displacementVol"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
        <DataRow title="效果检测（电测或探面）" dataType="wellReject" dataName="effect"
          :secondTitleSpan="secondTitleSpan"
          :list="list"
          :dataSpan="dataSpan"
        />
      </el-col>
    </el-row>

  </el-row>
</template>

<script>
import DataRow from './dataRow'
import FirstTitle from './firstTitle'
export default {
  components: {
    DataRow,
    FirstTitle
  },
  props: {
    list: {
      type: Array,
      default: ()=>[{}],
    },
    firstTitleSpan: {
      type: Number,
      default: 2,
    },
    secondTitleSpan: {
      type: Number,
      default: 4,
    },
    dataSpan: {
      type: Number,
      default: 4,
    },
  },
  data() {
    return {
      GEL10S_GEL10M:`GEL10"/10'`,
      headerFixed: false,
      headerWidth: 0
    }
  },
  mounted() {
    this.getHeaderWidth()
    window.addEventListener("scroll", this.getScrollX)
  },
  methods: {
    getHeaderWidth(){
      let obj = document.getElementById("CM_WK_BASIC").getBoundingClientRect()
      this.headerWidth = obj.width
    },
    getScrollX(){
      let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
      this.headerFixed = scrollTop >= 60;
    },
  },
  destroyed() {
    window.removeEventListener("scorll", this.getScrollX)
  },
}
</script>

<style lang="scss" scoped>
.sheet {
  font-size: 0.7rem;

  .header-fixed{
    position: fixed;
    top: 0;
    z-index: 999;
    background-color: skyblue;
    border: 2px solid;
  }

  .border-style {
    border-left: 2px solid;
    border-top: 2px solid;
    border-right: 2px solid;
  }

  .bottom-blod {
    border-bottom: 2px solid;
  }
}
</style>